<template>
	<div>
		<el-card class="!border-none p-4" shadow="never">
			<div class="topTitle font-bold main-color text-2xl mb-5">
				产品信息
			</div>
			<el-table class="mt-[20px] border-inherit" size="large" :data="lists"
				:header-cell-style="{'background':'#0054A6','color':'#fff','line-height':'52px','padding':'14px 0'}"
				:cell-style="{'color':'#0054A6','padding':'20px 0'}">
				<el-table-column label="产品编号" prop="scene_name" align="center">
					<template #default="{ row }">
						<el-button type="primary" link>
							<span class="main-color">0133</span>
						</el-button>
					</template>
				</el-table-column>
				<el-table-column label="产品名称" prop="type_desc" align="center" />
				<el-table-column label="库存" prop="scene_name" align="center">
					<template #default="{ row }">
						<el-input  placeholder="请输入"  clearable />
					</template>
				</el-table-column>
				<el-table-column label="应剩余" prop="scene_name" align="center" />
				<el-table-column label="当前剩余" prop="scene_name" align="center" />
				<el-table-column label="盈亏" prop="scene_name" align="center" />
				<el-table-column label="周转率" prop="scene_name" align="center" />
				<el-table-column label="长时间未出库统计" prop="scene_name" align="center" />
			</el-table>
			<div class="p-[20px] v-flex v-row-right">
				<el-pagination color="#0054A6" background layout="prev, pager, next" :default-page-size="6"
					:total="1000" :pager-count="6" />
			</div>
		</el-card>
		<el-row class="mt-[30px]">
			<el-button class="main-color1 w-[100px] h-[36px]" >
				<span>取消</span>
			</el-button>
			<el-button class="w-[100px] h-[36px]" color="#0054A6" type="primary">
				<span>保存</span>
			</el-button>
		</el-row>
	</div>
</template>

<script lang="ts" setup>
	const lists = ref<Array<any>>([
		{type:'出库单'}, {type:'入库单'}, {type:'出库单'}
	])
</script>

<style>
</style>